<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<%@taglib prefix="f" uri="http://java.sun.com/jsf/core" %>
<%@taglib prefix="h" uri="http://java.sun.com/jsf/html" %>
<%@taglib prefix="rich" uri="http://richfaces.org/rich" %>
<%@taglib prefix="a4j" uri="http://richfaces.org/a4j" %>
<%@taglib prefix="c" uri="http://java.sun.com/jstl/core_rt" %>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="../css/popup.css"/>
        <link rel="stylesheet" type="text/css" href="../css/kapiform.css"/>
        <script type="text/javascript" language="javascript" src="../scripts/jQuery/jq.date.js"></script>  
        <link rel="stylesheet" type="text/css" href="../css/ui.datepicker.css"/>
        <script type="text/javascript">        
            var open_cur = 0;      
            $j = jQuery.noConflict();
            $j(document).ready(function(){   
                var choisetab = $j('#choisetab').val();
                $j('input#date').datepicker({ dateFormat: 'dd/mm/yy', showOn: 'button', buttonImage: '../images/calenda_icon.gif', buttonImageOnly: true }); 
                $j('input#leavedate1').datepicker({ dateFormat: 'dd/mm/yy', showOn: 'button', buttonImage: '../images/calenda_icon.gif', buttonImageOnly: true }); 
                $j('.keysearch1').live('keyup',function(){
                    if($j('.keysearch1').val() == ""){
                        $j('.rich-table-row').show();
                                   
                    }else{
                        $j('.rich-table-row').hide();
                        $j('.rich-table-row').each(function(){
                            html = $j(this).html();
                            if(   ununicode(html).indexOf(  ununicode($j('.keysearch1').val()) ) > -1    )  {
                                $j(this).show();
                            }else{
                                $j(this).hide();
                            }
                        });
                    }

                });
                
                $j(".buttonsearch").live('click', function(){
                    $j(".research").show();
                });
            
                $j('.header-box').live('click', function(){  
                    $j('.mesage').text('');
                    if($j(this).next('.customer-box').css('display') != 'none'){
                        return;
                    }else{
                        PN100 = $j("#formKHCN\\:pn100").val();                       
                        if(PN100 != 0)
                        {
                            $j('.messa').hide();
                            $j('.customer-box').slideUp();                         
                            $j('.boder-bomttom').removeClass('boder-bomttom');
                            $j(this).next('.customer-box').slideDown();
                            $j(this).addClass('boder-bomttom');
                        } else{
                        
                            $j('.messa').show();
                            $j(this).next('.customer-box').css('display') != 'none'
                        }
                           
                    }

                });
                
                //Load ajax form 
                $j('.contactN950EMP').live('click',function(){
                    object = $j(this).next();
    
                    var PN100 = $j("#formKHCN\\:pn100").val(); 
    
                    $j.post("contactCRM.jsp?action=editajaxpage&pn100="+ PN100+"&table=N100", function(data){
                        $j('.customer-boxcontact').html(data);
                    });
    
                });
                    
                $j('.infoN350EMP').live('click',function(){
                    object = $j(this).next();
                    var PN100 = $j("#formKHCN\\:pn100").val(); 
                    alert(PN100);
                    $j.post("passportCRM.jsp?action=editajaxpage&pn100="+ PN100, function(data){
                        $j('.customer-boxN350').html(data);
                    });
                    
                });
                $j('.acountT025EMP').live('click',function(){
                    object = $j(this).next();
                    var PN100 = $j("#formKHCN\\:pn100").val();    
                    $j.post("accountCRM.jsp?action=editajaxpage&pn100="+PN100+"&tv026=N100",function(data){
                        $j('.customer-boxacount').html(data);
                    }) ;
                    
                });
                $j('.customerK100EMP').live('click',function(){
                    object = $j(this).next();
                    var PN100 = $j("#formKHCN\\:pn100").val(); 
                    $j.post("customerdemo.jsp?action=editEmp&pn100="+ PN100+"&table=formload&pt025=1&itemid=N100", function(data){
                        $j('.customer-boxcustomer').html(data);
                    });
                    
                });
                $j('.close111').live('click', function(){
                    lDateTime = new Date().getTime();           
                    var fk100 = $j(this).attr('title');
                   
                    if(choisetab==1)
                    {
                        window.location.href="cuscompany.jsp?tab=tab2"+ fk100 +"&flag="+lDateTime+"&#"+ fk100 +"";
                    }else{
                        var pk100 = $j(this).attr('lang');
                       
                
                        window.location.href="cuscompany.jsp?tab=tab3"+ pk100 +"&flag="+lDateTime+"&#"+ pk100 +"";
                    }
                    
                });
                $j('.close112').live('click', function(){
                    lDateTime = new Date().getTime();           
                    var fk100 = $j(this).attr('title');
                  
                    if(choisetab==1)
                    {
                        window.location.href="cuscompany.jsp?tab=tab2"+ fk100 +"&flag="+lDateTime+"&#"+ fk100 +"";
                    }else{
                        var pk100 = $j(this).attr('lang');
                       
                
                        window.location.href="cuscompany.jsp?tab=tab3"+ pk100 +"&flag="+lDateTime+"&#"+ pk100 +"";
                    }
                });
            });
        

        </script>
        <style type="text/css">

            .fromtim{
                float: left;
                width:100%;
                height: 30px;
                margin-bottom: 7px;
            }

            .bg_department{
                height: 68 !important;
            }
            .feild_sex td label{
                color:#4C4C4C;
            }
            #ui-datepicker-div
            {
                z-index: 9999999;
            }

            span img{
                height: 15px !important;
                width:15px !important;

            }
            .popup-content .main_content .form_item_content .edit_form_left .fields_input {
                float: left;

                width: 100%;
            }




            .buttonsavecmnd{
                background: url("../images/button_left.gif") repeat-x scroll 0 0 transparent;
                border: 0 none;
                color: white;
                cursor: pointer;
                float: right;
                font-size: 15px;
                font-weight: bold;
                height: 28px;
                margin-right: 20px;
                margin-top: 9px;
                text-transform: uppercase;
                width: 75px;
            }

            .buttonsaveContact{
                background: url("../images/button_left.gif") repeat-x scroll 0 0 transparent;
                border: 0 none;
                color: white;
                cursor: pointer;
                float: right;
                font-size: 15px;
                font-weight: bold;
                height: 28px;
                margin-right: 20px;
                margin-top: 9px;
                text-transform: uppercase;
                width: 75px;
            }
            .buttonsaveCompany{
                background: url("../images/button_left.gif") repeat-x scroll 0 0 transparent;
                border: 0 none;
                color: white;
                cursor: pointer;
                float: right;
                font-size: 15px;
                font-weight: bold;
                height: 28px;
                margin-right: 20px;
                margin-top: 9px;
                text-transform: uppercase;
                width: 75px;
            }
            .buttonsaveCompany1{
                background: url("../images/button_left.gif") repeat-x scroll 0 0 transparent;
                border: 0 none;
                color: white;
                cursor: pointer;
                float: right;
                font-size: 15px;
                font-weight: bold;
                height: 28px;
                margin-right: 20px;
                margin-top: 9px;
                text-transform: uppercase;
                width: 75px;
            }
            .buttonsaveAccount{
                background: url("../images/button_left.gif") repeat-x scroll 0 0 transparent;
                border: 0 none;
                color: white;
                cursor: pointer;
                float: right;
                font-size: 15px;
                font-weight: bold;
                height: 28px;
                margin-right: 20px;
                margin-top: 9px;
                text-transform: uppercase;
                width: 75px;
            }
            .fast_search1{

                margin-left: 100px;
            }
            .text_search1{

            }
            .fast_search1 input[type="text"]{
                height: 26px;
                width:300px;
                border: 1px solid #138EF9;
                border-radius: 4px ;
                float:left;

            }
            .fast_search1 a img{
                cursor: pointer;
                height: 34px;
                margin-left: 5px;
                width: 45px;
                border-radius: 4px ;

            }
            .buttonsearch1{
                font-weight: bold;
                border:0;          
                width:56px; height:24px;
                color:#ffffff;
                border-radius: 2px 3px 2px 3px;
                cursor:pointer;
                text-transform:uppercase;
                background-color: #526171;
            }
            
            .title labe{
                width:23px;
            }
            .sort_char1 label{
                width:21px ;
                text-align: center;
            }
            .sort_char1 {
                text-align: center;
                font-size: 11px ;
                margin-right: 0 ;
            }
            .sort_char1 a{
                border: 1px solid #82A6C7  ;
                color: #266DB3 ;
                cursor: pointer ;
                display: inline-block ;
                line-height: 20px ;

            }
            .research{

                float: left;
                width:100%;
                height: auto;
                margin-bottom: 10px;
            }
            .mesage{
                color: red;
                float: left;
                margin-left: 252px;
                margin-top: 20px;
                text-transform: uppercase;

            }
            .namecompany{
                float:left;
                width:50% 
            }
            .carew{
                float:left;
                width:50% 
            }
            .db{
                margin-left: -10px !important;
            }
            .idd{
                color: white;
            }
            .addcarew{
                display:none;
            }
            .addcarew1{
                display:block;
            }
            .congty{
                /* width:120px;*/
            }
            .button{
                float: left;
                width:100%;
                height: 40px;
            }
            .select_cus td label{
                width: 79px !important;
                margin-left: 2px;
            }
            .select_cus td{
                width: 119px !important;
            }
            .fromcareww{
                display: none;
                margin-top: 26px;
            }


            .message{
                color: red;
                float: left;
                margin-left: 202px;
                margin-top: 16px;
                text-align: center;
                font-weight: bold;
            }
            .header-box
            {
                width: 668px !important;
            }
            .customer-box
            {
                width: 672px !important;
            }

        </style>
    </head>




    <f:view>
        <h:inputHidden value="#{CustomerBean.choisetab}" id="choisetab"/>
        <body style=" float:left; width:auto; height:auto; margin:0px;">
            <f:loadBundle basename="#{environmentSession.localizationSource}" var="locale"/>
            <div class="popup" style="height:auto; width:720px">
                <div class="popup-header">
                    <div class="title"><h:outputText value="#{locale.customer_company_add}"/></div>

                </div>
                <div class="popup-content">
                    <a4j:form id="formKHCN" rendered="#{customerExpand.flagForm != 1}">
                        <span class="header-box boder-bomttom"><h:outputText value="#{locale.job_info}"/></span>
                        <div class="customer-box" style="" lang="<h:outputText value="#{CustomerBean.pn100}"/>">
                            <h:panelGroup>                                   
                                <div class="form-left" style="width:310px;">
                                    <div class="fields_input">
                                        <label><h:outputText value="#{locale.title}"/></label>
                                        <h:selectOneMenu value="#{CustomerBean.nv108}" styleClass="nv115">  
                                            <f:selectItems value="#{CustomerBean.selectItems}" />  
                                        </h:selectOneMenu>

                                    </div>
                                    <div class="fields_input">
                                        <label><h:outputText value="#{locale.fname}"/>*:</label>&nbsp;
                                        <h:inputText value="#{CustomerBean.nv102}" onkeyup="this.value=this.value.toUpperCase();" id="firstname" styleClass="required nv102">                                      
                                        </h:inputText>

                                    </div>
                                    <div class="fields_input">
                                        <label><h:outputText value="Chữ lót"/>*:</label>&nbsp;
                                        <h:inputText value="#{CustomerBean.nv127}" onkeyup="this.value=this.value.toUpperCase();" styleClass="required nv127">                                      
                                        </h:inputText>

                                    </div>
                                    <div class="fields_input">
                                        <label><h:outputText value="#{locale.lname}"/>*:</label>&nbsp;                                     
                                        <h:inputText value="#{CustomerBean.nv103}" onkeyup="this.value=this.value.toUpperCase();" id="lastname" lang="firstname" styleClass="required nv103"></h:inputText>
                                        </div>

                                    </div>
                                        <div class="form-right" style="width: 352px;">
                                        <%--
                                        <div class="fields_input">
                                            <label> <h:outputText value="#{locale.sex}"/>*:</label>
                                        <h:selectOneRadio value="#{CustomerBean.nv107}" styleClass="feild_sex"  style="width:100px;"   >
                                            <f:selectItem itemValue="M" itemLabel="#{locale.employeeSexMale}" />
                                            <f:selectItem itemValue="F" itemLabel="#{locale.employeeSexFmale}"/>                                                     
                                        </h:selectOneRadio>
                                    </div> --%>
                                    <div class="fields_input">                                       
                                        <label><h:outputText value="#{locale.dateBorn}"/>*:</label>&nbsp;
                                        <input type="text" id="leavedate1" name="leavedate1"  class="input_fields required date nd118"  
                                               value="<h:outputText value="#{CustomerBean.nd118}"> <f:convertDateTime pattern="dd/MM/yyyy"/></h:outputText>"/>

                                    </div>
                                    <div class="fields_input">
                                        <label><h:outputText value="#{locale.status_marries}"/>:</label>
                                        <h:selectOneMenu value="#{CustomerBean.nv109}"  >                                           
                                            <f:selectItem itemLabel="#{locale.status_family_true}" itemValue="1" />
                                            <f:selectItem itemLabel="#{locale.status_family_false}" itemValue="2" />
                                            <f:selectItem itemLabel="#{locale.status_family_orther}" itemValue="3" />
                                        </h:selectOneMenu>
                                    </div>
                                   

                                </div>
                                <div class="popup-footer">

                                    <h:inputHidden id="FFN600" value="#{CustomerBean.FN600}" />
                                    <h:inputHidden id="FK100" value="#{CustomerBean.fk100}" /> 
                                    <h:outputText value="#{CustomerBean.message}" id="mesage3" styleClass="mesage"/>
                                    <a4j:commandButton onclick="showPleaseWait();"  action="#{CustomerBean.saveCustomer}"  oncomplete="hidePleaseWait();$j('.messa').text('');"  styleClass="buttonsave savewait" value="#{locale.save}" reRender="lang,mesage3,pn100,formcompany">

                                    </a4j:commandButton>
                                    <h:inputHidden value="#{CustomerBean.flag}" id="flag" />
                                    <h:inputHidden value="#{CustomerBean.pn100}" id="pn100" />
                                    <h:inputHidden value="#{CustomerBean.fk100}" id="fk100" />
                                    <h:inputHidden value="#{CustomerBean.editpage}" id="editpage"/>
                                    <%--<h:inputHidden value="#{CustomerBean.sendPage}" id="sendPage" />--%>
                                    <h:inputHidden value="#{CustomerBean.fn850}" id="fn850" />
                                    <h:inputHidden value="#{CustomerBean.nv113}" id="nv113" />                                       
                                    <h:inputHidden value="#{CustomerBean.ni105}" id="ni105" />
                                    <h:inputHidden value="#{CustomerBean.nn117}" id="nn117" />


                                </div>


                            </h:panelGroup>                          
                            <!-- End List Content-->
                        </div>

                    </a4j:form>

                    <%-- Start Load ajax form postN950Ajax(forder Index) --%>
                    <h:panelGroup id="contact" >
                        <span class="header-box contactN950EMP"><h:outputText value="#{locale.contact_info}"/></span>
                        <div class="customer-box" style="display:none;">
                            <div class="customer-boxcontact">

                            </div>
                        </div>
                    </h:panelGroup>
                    <%-- End Load ajax form postN950Ajax(forder Index) --%>
                    <!-- giay to tuy than -->
                    <span class="header-box infoN350EMP" ><h:outputText value="#{locale.papers_person}"/></span>
                    <div class="customer-box" style="display:none">
                        <div class="customer-boxN350">
                            <!-- Danh cho from contact N950 ------------------------------------------>
                        </div>
                    </div>
                    <!-- end giay to tuy than -->

                    <h:panelGroup id="account">
                        <span class="header-box acountT025EMP" ><h:outputText value="#{locale.bank_account}"/></span>

                        <div class="customer-box" style="display:none">

                            <div class="customer-boxacount">
                                <!-- Danh cho from contact N950 ------------------------------------------>
                            </div>
                        </div>
                    </h:panelGroup>

                    <h:panelGroup id="accountnoibo">
                        <span class="header-box customerK100EMP"><h:outputText value="#{locale.orther_info}"/></span>

                        <div class="customer-box" style="display:none">

                            <div class="customer-boxcustomer">
                                <!-- Danh cho from contact N950 ------------------------------------------>
                            </div>
                        </div>
                    </h:panelGroup>


                    <div class="messa" style=" margin-left: 89px;margin-top: 368px !important;">                                
                        <h:outputText id="message" value="#{locale.please_save_customer}" style="display:none;margin-left:200px;color:red;font-weight:bold;font-style:italic;" styleClass="messa"/>
                        <h:outputText id="FK100E" value="#{customerExpand.FK100E}" style="display:none" styleClass="FK100E"/>

                    </div>

                </div>


                <div class="popup-footer">
                    <h:inputHidden value="#{CustomerBean.pn100}" id="pn100"/>
                    <h:inputHidden value="#{CustomerBean.fk100}" id="fk100"/>
                    <h:panelGroup rendered="#{CustomerBean.tip ==0}"> <div class="buttonsave close111" lang="<h:outputText value="#{CustomerBean.pn100}"/>" title="<h:outputText value="#{CustomerBean.fk100}"/>" style="" onclick="parent.jQuery.fancybox.close(); "  ><span><h:outputText value="#{locale.button_close}"/></span></div></h:panelGroup>
                    <h:panelGroup rendered="#{CustomerBean.tip ==1}"> <div class="buttonsave close112" lang="<h:outputText value="#{CustomerBean.pn100}"/>" title="<h:outputText value="#{CustomerBean.fk100}"/>" style="" onclick="parent.jQuery.fancybox.close(); "  ><span><h:outputText value="#{locale.button_close}"/></span></div></h:panelGroup>
                    </div>            


                </div>
            </body>

    </f:view>
</html>
<script type="text/javascript">
    $j(document).ready(function(){
        yhight = ($j('.popup').height()-90)+"px" ;
        $j('.main_content').css('height',yhight );
        $j('.popup-content').css('height',yhight );
    });
    $j(document).ready(function(){
        var idk100= '#k100-'+$j('.FK100E').text();
        //alert(idk100);
        $j(idk100).attr('checked',true);
        $j(idk100).attr('disabled',true);
    });
</script>